<template>
  <div>
    <p>我是子组件</p>
    <mark>{{info1}}</mark>
    <mark>{{info2}}</mark>
    <br>
    <button @click="add">{{info3[0]}}</button>
  </div>
</template>
<script>
export default {
  // 用来接受父组件传值的选项
  props: ['info1', 'info2', 'info3', 'info4'],
  data() {
    return {
      // 在data中新声明一个变量，接受传进来的值，修改自己的值
      myInfo4: this.info4
    }
  },
  created() {
    console.log(this.info3);
  },
  methods: {
    add() {
      // 如果父传子是引用数据类型，就是可读写的
      let num = this.info3[0]+1
      this.info3.splice(0, 1, num);
      this.myInfo4 = 777
    }
  }
}
</script>
<style scoped>

</style>